import * as React from "react";
import { inject, observer } from "mobx-react";
import { Switch, Route, Redirect } from 'react-router-dom';
import { Layout, message } from 'antd';
import { HomeRoutes } from '../../basicData/routes';
import HomeHeader from './header/HomeHeader';
import { History, Location } from 'history';
import { HomeStore } from '../../store';
import ls from '../../util/localStorage'


import './home.less';

const { Content, } = Layout;

interface IProps {
  homeStore?: HomeStore;
  history: History;
  location: Location;
  children?: AudioContextLatencyCategory;
}


interface State {
  // collapsed: boolean,
}

//初始化state并设为只读
const initialState: State = {
  // collapsed: false,
};

type IState = Readonly<typeof initialState>;

@inject("homeStore")
@observer
class Home extends React.Component<IProps, IState> {
  readonly state: IState = initialState;

  componentDidMount(){
    const curTime = new Date().getTime();
    const loginTime = ls.get('loginTime')
    const effectiveTime = ls.get('effectiveTime')
    const token = ls.get('token')

    if(curTime - loginTime > effectiveTime * 1000) {
      message.error('登录失效，即将跳转至登录页');
      ls.remove(['token','effectiveTime','loginTime'])
      this.props.history.push('/login')
    }
    if(token){
      this.props.homeStore.getUserInfo()
    }
    const pathname = this.props.location.pathname;
    this.props.homeStore.changePathname(pathname);
  }

  UNSAFE_componentWillReceiveProps(nextProps:IProps) {
    const pathname =  nextProps.location.pathname;
    this.props.homeStore.changePathname(pathname);
  }

  render() {
    return (
      <Layout className="home">
        {/* <HomeSider /> */}
        <Layout>
          <HomeHeader history={this.props.history} />
          <Content className="home-content">
            <div className="home-content-content">
              <Switch>
                {HomeRoutes.map((item: { exact: boolean, path: string, component: any }, index: number) => (
                  <Route
                    key={index}
                    exact={item.exact}
                    path={item.path}
                    component={item.component}
                  />
                ))}
                {this.props.location.pathname === '/' ? <Redirect to="" /> : <Redirect to="/notFound" />}
              </Switch>
            </div>
            <div className="home-content-footer">
              <span style={{paddingRight: 10}}>Copyright © 1998 - 2018 HICAP All Rights Reserved. 海普智联 版权所有</span>
              <a href="https://www.ht-intel.net/">海特智能 </a>
            </div>
          </Content>
        </Layout>
      </Layout>
    );
  }
}

export default Home
